import designSetting from '@/settings/designSetting.js'
import { lighten } from '@/utils'
import { storage } from '@/utils/storage'
import { CURRENT_THEME } from '@/store/mutation-types'
const { appTheme, themeList } = designSetting

export default {
  namespaced: true,
  state: {
    appTheme: storage.get(CURRENT_THEME, appTheme),
  },
  getters: {
    getGlobTheme(state) {
      return state.appTheme
    },
    getGlobThemeColor(state) {
      return themeList[state.appTheme] || ''
    },
    getGlobThemeColorHover(state) {
      let color = themeList[state.appTheme]
      const lightenStr = lighten(color, 6)
      return lightenStr
    },
    getGlobThemeColorDisabled(state) {
      let color = themeList[state.appTheme]
      const lightenStr = lighten(color, 15)
      return lightenStr
    },
  },
  mutations: {
    setGlobAppTheme(state, value) {
      state.appTheme = value
      storage.set(CURRENT_THEME, value)
    },
  },
}
